<%-------------------------------------------------
ファイル名：HolidayAttendance.jsp
所      属：H3A1 04
名      前：大瀬碩
説      明：土日出校申請画面
---------------------------------------------------%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<link rel="stylesheet" href="http://code.jquery.com/ui/1.9.2/themes/base/jquery-ui.css" />
<script src="http://code.jquery.com/jquery-1.8.3.js"></script>
<script src="http://code.jquery.com/ui/1.9.2/jquery-ui.js"></script>
<script>
  $(function() {
    $( "#datepicker" ).datepicker({
      showOtherMonths: true,
      selectOtherMonths: true
    });
    $( "#datepicker" ).datepicker( "option", "dateFormat", "yy/mm/dd" );
  });
  
  $(function() {
	    $( "#datepicker2" ).datepicker({
	      showOtherMonths: true,
	      selectOtherMonths: true
	    });
	    $( "#datepicker2" ).datepicker( "option", "dateFormat", "yy/mm/dd" );
	  });
  </script>

<script type="text/javascript"> 
<!-- 
//入力チェック
function checkForm(){
	var flag = 0;
	
	if(document.holiday.sat.checked == false && document.holiday.sun.checked == false){
		alert('希望曜日にチェックが入っていません');
		return false;
	}
	
	if(document.holiday.sat.checked == true){
		if(document.holiday.satpd.value == ""){
			flag = 1;
		}
		else if(document.holiday.satst.value == ""){
			flag = 1;
		}
		else if(document.holiday.satet.value == ""){
			flag = 1;
		}
		else if(document.holiday.satr.value == ""){
			flag = 1;
		}
		else if(document.holiday.sattxt.value == ""){
			flag = 1;
		}
	}
	if(document.holiday.sun.checked == true){
		if(document.holiday.sunpd.value == ""){
			flag = 1;
		}
		else if(document.holiday.sunst.value == ""){
			flag = 1;
		}
		else if(document.holiday.sunet.value == ""){
			flag = 1;
		}
		else if(document.holiday.sunr.value == ""){
			flag = 1;
		}
		else if(document.holiday.suntxt.value == ""){
			flag = 1;
		}
	}
	if(flag == 1){
		window.alert('未入力があります');
		return false; 
	}
	else{
		return true; 
	}
}
// -->
</script>

 <link href="css/bootstrap.min.css" rel="stylesheet">
<title>土日出校</title>
</head>
<body>
<!-- ナビゲーションバー -->
<div class="navbar navbar-default">
  <div class="navbar-header">
    <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
      <span class="icon-bar"></span>
      <span class="icon-bar"></span>
      <span class="icon-bar"></span>
    </button>
    <a class="navbar-brand" href="index.jsp"><img alt="" src="images/logo2.png"></a>
  </div>
  <div class="navbar-collapse collapse">
    <ul class="nav navbar-nav">
      <li><a href="TimetableClassSelection.jsp">時間割情報</a></li>
      <li><a href="ClubList.jsp">部活動情報</a></li>
      <li><a href="SupplementaryClasses.jsp">振り替え補講</a></li>
      <li class="active"><a href="HolidayAttendance.jsp">土日出校申請</a></li>
      <li><a href="AttendanceHistory.jsp">出席履歴</a></li>
    </ul>
    <ul class="nav navbar-nav navbar-right">
      <li><a href="<%out.print(request.getContextPath());%>/Logout">ログアウト</a></li>
    </ul>
  </div>
</div>
	<h1 align="center">土日出校</h1>
	<h3 align="center">出校を希望する曜日にチェックを入れ、全項目を選択・記入してください</h3>
	<form name="holiday" method="post" action="HolidayAttendance" onSubmit="return checkForm()" accept-charset="UTF-8">
	<div class="form-group">
		<div class="container">
			<div align="center">
				<table align="center" class="table table-bordered" style="font-size: large">
					<tr>
						<th>希望日:</th>
						<td><input type="checkbox" name="sat" value="1">土曜日<input type="text" name="satpd" size="8" id="datepicker" class="form-control"></td>
						<td><input type="checkbox" name="sun" value="1">日曜日<input type="text" name="sunpd" size="8" id="datepicker2" class="form-control"></td>
					</tr>
					
					<tr>
						<th rowspan="2">希望時間:</th>
						<td>開始
						<select name="satst">
						<option value="9">9時</option>
						<option value="10">10時</option>
						<option value="11">11時</option>
						<option value="12">12時</option>
						<option value="13">13時</option>
						<option value="14">14時</option>
						<option value="15">15時</option>
						<option value="16">16時</option>
						<option value="17">17時</option>
						<option value="18">18時</option>
						</select>
						</td>
						<td>開始
						<select name="sunst">
						<option value="9">9時</option>
						<option value="10">10時</option>
						<option value="11">11時</option>
						<option value="12">12時</option>
						<option value="13">13時</option>
						<option value="14">14時</option>
						<option value="15">15時</option>
						<option value="16">16時</option>
						<option value="17">17時</option>
						<option value="18">18時</option>
						</select>
						</td>
					</tr>
					
					<tr>
						<td>終了
						<select name="satet">
						<option value="10">10時</option>
						<option value="11">11時</option>
						<option value="12">12時</option>
						<option value="13">13時</option>
						<option value="14">14時</option>
						<option value="15">15時</option>
						<option value="16">16時</option>
						<option value="17">17時</option>
						<option value="18">18時</option>
						<option value="19">19時</option>
						</select>
						</td>
						<td>終了
						<select name="sunet">
						<option value="10">10時</option>
						<option value="11">11時</option>
						<option value="12">12時</option>
						<option value="13">13時</option>
						<option value="14">14時</option>
						<option value="15">15時</option>
						<option value="16">16時</option>
						<option value="17">17時</option>
						<option value="18">18時</option>
						<option value="19">19時</option>
						</select>
						</td>
					</tr>
					
					<tr>
						<th>希望教室:</th>
						<td><select name="satr">
						<option value="1">102教室</option>
						<option value="2">104教室</option>
						<option value="3">201教室</option>
						<option value="4">202教室</option>
						<option value="5">203教室</option>
						<option value="6">301教室</option>
						<option value="7">302教室</option>
						<option value="8">303教室</option>
						<option value="9">304教室</option>
						<option value="10">401A教室</option>
						<option value="11">401B教室</option>
						<option value="12">402教室</option>
						<option value="13">403教室</option>
						<option value="14">404教室</option>
						</select>
						</td>
						<td><select name="sunr">
						<option value="1">102教室</option>
						<option value="2">104教室</option>
						<option value="3">201教室</option>
						<option value="4">202教室</option>
						<option value="5">203教室</option>
						<option value="6">301教室</option>
						<option value="7">302教室</option>
						<option value="8">303教室</option>
						<option value="9">304教室</option>
						<option value="10">401A教室</option>
						<option value="11">401B教室</option>
						<option value="12">402教室</option>
						<option value="13">403教室</option>
						<option value="14">404教室</option>
						</select></td>
					</tr>
					
					<tr>
						<th>理由:</th>
						<td><textarea name="sattxt" cols="27" rows="10" class="form-control"></textarea></td>
						<td><textarea name="suntxt" cols="27" rows="10" class="form-control"></textarea></td>
					</tr>
				</table>
			</div>
		</div>
		<div align="center">
			<a href="index.jsp" class="btn btn-lg btn-danger"><i class="glyphicon glyphicon-arrow-left"><br>戻る</i></a>
			<button class="btn btn-lg btn-danger" type="submit"><i class="glyphicon glyphicon-upload"><br>確認</i></button>
		</div>
		</div>
	</form>
</body>
</html>